<!DOCTYPE html>
<html lang="{{site.locale}}" {{#if site.rtl}}dir="rtl"{{/if}}>
{{> html-head }}

<body>
  {{> header }}

  <div id="main">
    <div class="container has-side-nav">

      {{> navigation key='foundation'}}

      <article>
        <div class="container no-headline" id="announcements-list">
          <ul class="news-list">
            <li>Loading data...</li>
          </ul>
        </div>
      </article>
    </div>
  </div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/tabletop.js/1.4.2/tabletop.min.js"></script>
  <script>
  var publicSpreadsheetUrl = 'https://docs.google.com/spreadsheets/d/1xwQ6ciZLADL43My_XBIWLVRuDMl8cx_omYd1FRkBZ58/pubhtml'
  var mdList = {{{getListJson collections.blogAnnounce}}}
  var siteLocal = '/{{site.locale}}/'

  window.onload = function () {
    /* global Tabletop */
    Tabletop.init(
      {
        key: publicSpreadsheetUrl,
        callback: showInfo,
        simpleSheet: true
      }
    )

    function pad (str) { return ('0' + str).substr(-2) }

    function parseDate (date) {
      try {
        var parsedDate = date.split('.')
        return new Date('20' + parsedDate[2], parsedDate[0] - 1, parsedDate[1])
      } catch (_) {
        return date
      }
    }

    function formatDate (date) {
      return date === 'Invalid Date' ? '' : date.getFullYear() + '-' + pad(date.getMonth() + 1) + '-' + pad(date.getDate())
    }

    function showInfo (data, tabletop) {
      data.reverse()
      var html = ''
      var list = document.getElementsByClassName('news-list')
      var docList = []

      data.forEach(function (row) {
        docList.push({
          path: row.Link,
          title: row.Title,
          local: false,
          date: parseDate(row.Date)
        })
      })

      var allList = mdList.concat(docList)
      allList.sort(function (a, b) {
        return new Date(b.date).getTime() - new Date(a.date).getTime()
      })

      allList.forEach(function (row) {
        if (row && row.date) {
          html += '<li><time datetime="' + row.date + '">' + formatDate(new Date(row.date)) + '</time>'
          html += '<a href="'
          html += (row.local) ? siteLocal + row.path : row.path
          html += '">' + row.title + '</a></li>'
        }
      })
      if (list && list[0]) list[0].innerHTML = html
    }
  }
  </script>
  {{> footer }}
</body>
</html>
